// pages/search/search.js
import http from '../../utils/http'
Page({

  /**
   * 页面的初始数据
   */
  data: {
    historyList: [], // 用来收集用户的搜索历史记录
    text: '', // 记录用户输入框中输入的文本
    result: [], // 记录用户搜索出来的数据 
    isRequest: false // 用来标记是否处于请求进行中 false 表示没有请求 true表示请求中
  },

  async getResult(key) { // 获取搜索结果的方法
    // get请求的参数的表现形式是只能在请求地址上显示
    this.setData({
      isRequest: true
    })
    let {message} = await http({url: '/public/v1/goods/search?query=' + key})
    //  console.log(message);
    let arr = []
    if(!message)  {
      arr = []
    } else {
      arr = message.goods
    }
    this.setData({
      result: arr,
      isRequest: false
    })
  },

  search(e) { // 输入框失去焦点时进行数据搜索
    // console.log(e);
    let value = e.detail.value
    if(!value) return
    // this.data.historyList.unshift(value)
    // set是es6提供的一个新方法 他会生成一个类数组对象 并且他的数据不允许重复
    // let arr = [...new Set(this.data.historyList)]
    // es5的写法
    this.data.historyList.forEach((item, i) => {
      if(item === value) { // 如果判断成立证明数据已经重复了
        this.data.historyList.splice(i, 1) // 将重复的数据删除
      }
    })
    this.data.historyList.unshift(value) // 将新的数据添加在数组列表的最前方
    // 给搜索历史记录加上数据量的限制
    if(this.data.historyList.length > 10) {
      this.data.historyList.length = 10
    }
    this.setData({
      historyList: this.data.historyList,
      text: ''
    })
    // 微信小程序同步存储数据的方法
    // wx.setStorage({}) // 这是小程序的异步存储数据的方法
    wx.setStorageSync('history', this.data.historyList)
    this.getResult(value)
  },

  delHistory() { // 删除历史记录的方法
    this.setData({
      historyList: []
    })
    wx.setStorageSync('history', [])
  },

  historySearch(e) { // 点击历史记录进行数据搜索
    // console.log(e);
    let value = e.currentTarget.dataset.item
    this.setData({
      text: value
    })
    this.getResult(value)
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {

  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {
    // 微信小程序获取同步存储的数据的方法
    let data = wx.getStorageSync('history') || []
    // console.log(data);
    this.setData({
      historyList: data
    })
  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  }
})